<template>
  <el-form ref="auditActor" :model="actor" label-width="150px" :rules="actorRules">
    <el-form-item label="限定范围" prop="Mode">
      <el-radio-group v-model="actor.Mode" :disabled="readonly" class="specifyMode" @change="modeChange(true)">
        <el-radio v-for="item in SpecifyMode" :key="item.value" :label="item.value">{{ item.text }}</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item v-if="actor.Mode == 128 || actor.Mode == 1024" label="行政范围" prop="Range">
      <el-radio-group v-model="actor.Range" :disabled="readonly" class="specifyMode" @change="modeChange(false)">
        <el-radio v-if="auditType != 2" :label="0">无</el-radio>
        <el-radio :label="2">所在公司</el-radio>
        <el-radio :label="4">所在部门</el-radio>
        <el-radio :label="256">上级部门</el-radio>
        <el-radio :label="512">下级部门</el-radio>
        <el-radio :label="32">所在单位</el-radio>
        <el-radio :label="2048">上级单位</el-radio>
        <el-radio :label="4096">下级单位</el-radio>
      </el-radio-group>
    </el-form-item>
    <el-form-item v-if="actor.Mode == 2 || actor.Mode == 4 || actor.Mode == 32" label="限定公司" prop="CompanyId">
      <companySelect
        v-model="actor.CompanyId"
        :readonly="readonly"
        :label.sync="actor.ComName"
      />
    </el-form-item>
    <el-form-item v-if="actor.Mode == 32" label="限定单位" prop="UnitId">
      <deptSelect
        v-model="actor.UnitId"
        :readonly="readonly"
        :company-id="actor.CompanyId"
        :label.sync="actor.UnitName"
        :is-unit="true"
        placeholder="限定单位"
      />
    </el-form-item>
    <el-form-item v-else-if="actor.Mode == 4" label="限定部门" prop="DeptId">
      <deptSelect
        v-model="actor.DeptId"
        :readonly="readonly"
        :label.sync="actor.DeptName"
        :company-id="actor.CompanyId"
        :is-chiose-unit="false"
        placeholder="限定部门"
      />
    </el-form-item>
    <template v-if="limitMode.includes(actor.Mode) || (actor.Range != 0 && actor.Mode == 128)">
      <el-form-item label="职务或岗位">
        <el-radio-group v-model="actor.TitleOrPost" :disabled="readonly">
          <el-radio :label="0">职务</el-radio>
          <el-radio :label="1">岗位</el-radio>
          <el-radio :label="2">负责人</el-radio>
        </el-radio-group>
      </el-form-item>
      <el-form-item v-if="actor.TitleOrPost == 0" label="限定职务" prop="TitleCode">
        <dictItem
          v-model="actor.TitleCode"
          :readonly="readonly"
          :dic-id="HrItemDic.title"
          :multiple="true"
          :label.sync="actor.TitleName"
          placeholder="职务"
        />
      </el-form-item>
      <el-form-item v-else-if="actor.TitleOrPost == 1" label="限定岗位" prop="PostCode">
        <treeDicItem
          v-model="actor.PostCode"
          :readonly="readonly"
          :is-multiple="true"
          :dic-id="HrItemDic.post"
          :label.sync="actor.PostName"
          placeholder="岗位"
        />
      </el-form-item>
    </template>
    <el-form-item v-else-if="actor.Mode == 16" label="限定职务" prop="TitleCode">
      <dictItem
        v-model="actor.TitleCode"
        :readonly="readonly"
        :dic-id="HrItemDic.title"
        :multiple="true"
        :label.sync="actor.TitleName"
        placeholder="职务"
      />
    </el-form-item>
    <el-form-item v-else-if="actor.Mode == 8" label="限定岗位" prop="PostCode">
      <treeDicItem
        v-model="actor.PostCode"
        :readonly="readonly"
        :dic-id="HrItemDic.post"
        :is-multiple="true"
        :label.sync="actor.PostName"
        placeholder="岗位"
      />
    </el-form-item>
    <el-form-item v-else-if="actor.Mode == 3" label="指定审批人" prop="EmpId">
      <empInput v-model="actor.EmpId" :readonly="readonly" :label.sync="actor.EmpName" :is-multiple="auditType == 2" placeholder="指定审批人" />
    </el-form-item>
    <template v-else-if="actor.Mode == 1">
      <el-form-item label="选择表单字段" prop="ColId">
        <formColChiose v-model="actor.ColId" :readonly="readonly" :label.sync="actor.ColName" :form-id="[formId]" :table-id.sync="actor.TableId" :func-type="[1]" :ver="actor.Mode" />
      </el-form-item>
      <el-form-item label="筛选方案名" prop="Keywords">
        <el-input v-model="actor.Keywords" placeholder="配合字段使用的筛选方案" :clearable="true" />
      </el-form-item>
    </template>
    <el-form-item v-else-if="actor.Mode == 7" label="指定节点审批人" prop="ToNodeId">
      <el-select
        v-model="node.ToNodeId"
        :disabled="readonly"
        placeholder="指定节点审批人"
        :clearable="true"
      >
        <el-option v-for="t in nodes" :key="t.Id" :label="t.NodeName" :value="t.Id" />
      </el-select>
    </el-form-item>
    <div v-if="readonly == false" style="text-align: center">
      <el-button type="primary" @click="saveActor">保存</el-button>
      <el-button @click="intAuditEmp">重置</el-button>
    </div>
  </el-form>
</template>

<script>
import { SpecifyMode } from '@/flow/config/flowConfig'
import { HrItemDic } from '@/config/publicDic'
import * as nodeAuditEmpApi from '@/flow/api/flowNodeAuditEmp'
import companySelect from '@/components/company/companySelect.vue'
import deptSelect from '@/components/unit/deptSelect.vue'
import empInput from '@/components/emp/empInput.vue'
import formColChiose from '@/customForm/components/form/formColChiose.vue'
export default {
  components: {
    deptSelect,
    companySelect,
    empInput,
    formColChiose
  },
  props: {
    nodeId: {
      type: String,
      default: null
    },
    readonly: {
      type: Boolean,
      default: false
    },
    formId: {
      type: String,
      default: null
    },
    flowId: {
      type: String,
      default: null
    },
    auditType: {
      type: Number,
      default: 0
    },
    nodes: {
      type: Array,
      default: null
    },
    isLoad: {
      type: Boolean,
      default: false
    },
    show: {
      type: String,
      default: null
    }
  },
  data() {
    return {
      HrItemDic,
      SpecifyMode,
      curFormId: null,
      limitMode: [2, 4, 32, 1024],
      actorRules: {
        Mode: [
          {
            required: true,
            message: '限定范围不能为空！',
            trigger: 'blur'
          }
        ],
        UnitId: [
          {
            required: true,
            message: '限定单位不能为空！',
            trigger: 'blur'
          }
        ],
        DeptId: [
          {
            required: true,
            message: '限定单位不能为空！',
            trigger: 'blur'
          }
        ],
        EmpId: [
          {
            required: true,
            message: '指定人员不能为空！',
            trigger: 'blur'
          }
        ],
        CompanyId: [
          {
            required: true,
            message: '限定公司不能为空！',
            trigger: 'blur'
          }
        ],
        TitleCode: [
          {
            required: true,
            message: '职务不能为空！',
            trigger: 'blur'
          }
        ],
        PostCode: [
          {
            required: true,
            message: '岗位不能为空！',
            trigger: 'blur'
          }
        ],
        ToNodeId: [
          {
            required: true,
            message: '指定节点不能为空！',
            trigger: 'blur'
          }
        ]
      },
      actor: {
        TitleOrPost: 0,
        Mode: 0,
        Range: 0,
        CompanyId: null,
        UnitId: null,
        DeptId: null,
        TitleCode: null,
        PostCode: null,
        EmpId: null,
        TableId: null,
        ColId: null,
        Show: null,
        Keywords: null
      }
    }
  },
  computed: {
    comId() {
      return this.$store.getters.curComId
    }
  },
  watch: {
    isLoad: {
      handler(val) {
        if (val) {
          this.intAuditEmp()
        }
      },
      immediate: true
    },
    formId: {
      handler(val) {
        if (val) {
          this.curFormId = [val]
        } else {
          this.curFormId = null
        }
      },
      immediate: true
    }
  },
  mounted() {
  },
  methods: {
    modeChange(isMode) {
      this.actor.CompanyId = this.comId
      if (isMode) {
        if (this.actor.Mode === 128 || this.actor.Mode === 1024) {
          this.actor.Range = this.auditType === 2 ? 2 : 0
        } else {
          this.actor.Range = 0
        }
      }
      this.actor.UnitId = null
      this.actor.DeptId = null
      this.actor.DeptName = null
      this.actor.UnitName = null
      this.actor.ComName = null
      this.actor.ColName = null
      this.actor.EmpName = null
      this.actor.Keywords = null
      this.actor.TitleOrPost = 0
      this.actor.TitleCode = null
      this.actor.PostCode = null
      this.actor.EmpId = null
      this.actor.ToNodeId = null
      this.actor.TableId = null
      this.actor.ColId = null
    },
    saveActor() {
      const that = this
      this.$refs['auditActor'].validate((valid) => {
        if (valid) {
          that.setActor()
        } else {
          return false
        }
      })
    },
    formatShow() {
      const mode = this.actor.Mode
      let show = SpecifyMode.find(a => a.value === mode).text
      if (mode === 2) {
        show = '限定公司:' + this.actor.ComName
      } else if (mode === 32) {
        show = '限定单位:' + this.actor.UnitName
      } else if (mode === 4) {
        show = '限定部门:' + this.actor.DeptName
      } else if (mode === 1) {
        show = '限定读取表单字段:' + this.actor.ColName
      } else if (mode === 3) {
        show = '限定审批人:' + this.actor.EmpName
      } else if (mode === 7) {
        show = '限定节点审批人:' + this.nodes.find(c => c.Id === this.actor.ToNodeId).NodeName
      } else if (mode === 16) {
        show = '限定职务:' + this.actor.TitleName
      } else if (mode === 8) {
        show = '限定岗位:' + this.actor.PostName
      }
      if (mode === 128 || mode === 1024) {
        if (this.actor.Range === 256) {
          show = show + '的上级部门'
        } else if (this.actor.Range === 512) {
          show = show + '的下级部门'
        } else if (this.actor.Range === 2048) {
          show = show + '的上级单位'
        } else if (this.actor.Range === 4096) {
          show = show + '的下级单位'
        } else if (this.actor.Range === 4) {
          show = show + '所在部门'
        } else if (this.actor.Range === 32) {
          show = show + '所在单位'
        } else if (this.actor.Range === 2) {
          show = show + '所在公司'
        }
      }
      if (this.limitMode.includes(mode) || (this.actor.Range !== 0 && this.actor.Mode === 128)) {
        if (this.actor.TitleOrPost === 0) {
          show = show + '，职务:' + this.actor.TitleName
        } else if (this.actor.TitleOrPost === 1) {
          show = show + '，岗位:' + this.actor.PostName
        } else {
          show = show + '，负责人'
        }
      }
      return show
    },
    formatActor() {
      const data = {
        FlowId: this.flowId,
        NodeId: this.nodeId,
        CompanyId: this.actor.CompanyId,
        TitleCode: this.actor.TitleCode,
        PostCode: this.actor.PostCode,
        DeptId: this.actor.DeptId,
        UnitId: this.actor.UnitId,
        TableId: this.actor.TableId,
        ColId: this.actor.ColId,
        EmpId: this.actor.EmpId,
        ToNodeId: this.actor.ToNodeId,
        Keywords: this.actor.Keywords
      }
      if (data.EmpId != null && !Array.isArray(data.EmpId)) {
        data.EmpId = [data.EmpId]
      }
      let mode = this.actor.Mode
      if (this.limitMode.includes(mode) || (this.actor.Range !== 0 && this.actor.Mode === 128)) {
        if (this.actor.TitleOrPost === 0) {
          mode = mode + 16
        } else if (this.actor.TitleOrPost === 2) {
          mode = mode + 64
        } else {
          mode = mode + 8
        }
      }
      data.SpecifyMode = mode + this.actor.Range
      data.Show = this.formatShow()
      return data
    },
    async setActor() {
      const data = this.formatActor()
      await nodeAuditEmpApi.Set(data)
      this.$message({
        type: 'success',
        message: '保存成功!'
      })
      this.$emit('update:show', data.Show)
      this.$emit('change', data)
    },
    async intAuditEmp() {
      const res = await nodeAuditEmpApi.Get(this.nodeId)
      if (res == null) {
        this.actor.Mode = 0
        this.actor.Range = 0
        this.modeChange()
      } else {
        this.actor.CompanyId = res.CompanyId ? res.CompanyId : this.comId
        this.actor.UnitId = res.UnitId
        this.actor.DeptId = res.DeptId
        this.actor.ToNodeId = res.ToNodeId
        this.actor.TitleCode = res.TitleCode
        this.actor.PostCode = res.PostCode
        this.actor.EmpId = res.EmpId
        this.actor.TableId = res.TableId
        this.actor.ColId = res.ColId
        this.actor.Show = res.Show
        this.actor.Keywords = res.Keywords
        this.actor.Range = 0
        let mode = res.SpecifyMode
        if (mode === 0) {
          this.actor.Mode = 0
        } else if (mode % 2 !== 0) {
          this.actor.Mode = mode
        } else if ((128 & mode) === 128 || (1024 & mode) === 1024) {
          const val = (128 & mode) === 128 ? 128 : 1024
          this.actor.Mode = val
          mode = mode - val
          if ((64 & mode) === 64) {
            this.actor.TitleOrPost = 2
            mode = mode - 64
          } else if ((8 & mode) === 8) {
            this.actor.TitleOrPost = 1
            mode = mode - 8
          } else {
            this.actor.TitleOrPost = 0
            mode = mode - 16
          }
          this.actor.Range = mode
        } else {
          if ((64 & mode) === 64) {
            this.actor.TitleOrPost = 2
            mode = mode - 64
          } else if ((8 & mode) === 8) {
            this.actor.TitleOrPost = 1
            mode = mode - 8
          } else {
            this.actor.TitleOrPost = 0
            mode = mode - 16
          }
          this.actor.Mode = mode
        }
      }
    },
    deptChange(e) {
      if (e.value.length > 0) {
        const dept = e.dept[0]
        this.actor.UnitId = dept.UnitId
        if (dept.IsUnit) {
          this.actor.DeptId = null
        }
      } else {
        this.actor.UnitId = null
      }
    }
  }
}
</script>
<style scoped>
.el-checkbox-group {
    line-height: 40px
}
.specifyMode .el-radio {
  line-height: 20px;
  width: 25%;
}
</style>
